<template>
  <div>
    <van-loading v-show="loading" type="spinner" size="24px" />
    <div v-show="isImage">
      <img ref="authimg" src="" alt="" style="display:none;">
      <van-uploader class="uploader" v-model="fileList" :max-count="1" :deletable="false"/>
    </div>
    <div class="file" v-show="!isImage">
      <a ref="downloadLink" :download="filename" @click="download" style="color: blue;">{{filename}}</a>
    </div>
  </div>
</template>
<script>
export default {
  name: "TopTools",
  props: {
    filename: {
      type: String,
      default: ''
    },
    fileid: {
      type: String | Number,
      default: ''
    },
    fileallname: {
      type: String,
      default: ''
    }
  },
  components: {

  },
  data () {
    return {
      loading: false,
      fileList: [],
      isImage: false
    };
  },
  methods: {
    getBase64Image (img) {
      var canvas = document.createElement("canvas");
      canvas.width = img.width;
      canvas.height = img.height;
      var ctx = canvas.getContext("2d");
      ctx.drawImage(img, 0, 0, img.width, img.height);
      var dataURL = canvas.toDataURL("image/png");
      return dataURL;
      // return dataURL.replace("data:image/png;base64,", ""); 
    },
    download: function () {
      var vm = this;
      if (process.env.NODE_ENV == 'development' || vm.$util.getQueryString('debug')) {
        if (vm.$refs.downloadLink.href) {
          vm.$refs.downloadLink.click();
          return;
        }
        let request = new XMLHttpRequest();
        request.responseType = 'blob';
        request.open('get', vm.filesrc, true);

        request.setRequestHeader('requestType', 'app');
        request.setRequestHeader('applyID', '95b71316cebe4a18906066d9799faa59');
        request.setRequestHeader('secretKey', '13FFDB8B49D6568D78EB907AFBB6C17D');
        request.setRequestHeader('accessToken', vm.$db.get('accessToken'));

        request.onreadystatechange = e => {
          if (request.readyState == XMLHttpRequest.DONE && request.status == 200) {
            var src = URL.createObjectURL(request.response);
            vm.$refs.downloadLink.href = src;
            vm.$refs.downloadLink.click();
          }
        };
        request.send(null);
      } else {
        vm.$mLingwu.printFile(vm.filesrc, vm.fileallname.split(',').pop());
      }
    },
    loadImg (url) {
      let img = this.$refs.authimg;
      let request = new XMLHttpRequest();
      request.responseType = 'blob';
      request.open('get', url, true);
      request.setRequestHeader('requestType', 'app');
      request.setRequestHeader('applyID', '95b71316cebe4a18906066d9799faa59');
      request.setRequestHeader('secretKey', '13FFDB8B49D6568D78EB907AFBB6C17D');
      request.setRequestHeader('accessToken', this.$db.get('accessToken'));

      this.loading = true;
      request.onreadystatechange = e => {
        if (request.readyState == XMLHttpRequest.DONE) {
          this.loading = false;
          if (request.status == 200) {
            img.src = URL.createObjectURL(request.response);
            img.onload = () => {
              URL.revokeObjectURL(img.src);
              this.fileList = [{
                url: this.getBase64Image(img),
                isImage: 1
              }];
            };
          }
        }
      };
      request.send(null);
    }
  },
  mounted: function () {
    var vm = this;
    var imgExt = [".png", ".jpg", ".jpeg", ".bmp", ".gif"];
    var isImage = imgExt.find(n => vm.filename.endsWith(n) || vm.filename.endsWith(n.toUpperCase()));
    vm.isImage = isImage;
    if (vm.fileallname) {
      vm.filesrc = 'http://183.207.196.25:50087/ga/jygawebcitycrisis/JYGAWebCityCrisis/downloadfileJK.do?fileallname=' + vm.fileallname;
      isImage && vm.loadImg(vm.filesrc, vm.fileallname);
    } else {
      vm.$getAndLoad('图片', 'searchfileByIdJK.do?fileid=' + vm.fileid, function (data) {
        if (data.code == '1') {
          vm.filesrc = 'http://183.207.196.25:50087/ga/jygawebcitycrisis/JYGAWebCityCrisis/downloadfileJK.do?fileallname=' + data.data.fileallname;
          vm.fileallname = data.data.fileallname;
          isImage && vm.loadImg(vm.filesrc, data.data.fileallname);
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
</style>
